let box = document.querySelector('.box');
let zonghe = document.querySelector('.box .zonghe');
let remen = document.querySelector('.box .remen');
let xinzeng = document.querySelector('.box .xinzeng');
let token = Cookies.get('info');
let li01 = document.querySelector('.li-1');
let li02 = document.querySelector('.li-2');
let li03 = document.querySelector('.li-3');
console.log(token);
li01.onclick = function() {
    zonghe.style.display = 'block';
    remen.style.display = 'none';
    xinzeng.style.display = 'none';
    zongheH()
}

zongheH()

function zongheH() {
    axios.post(ComprehensiveApi, {
        token,
        "pageNum": 1,
        "pageSize": 10
    }).then(res => {
        console.log(res.data.info);
        let obj = res.data.info;
        let html = '';
        for (let i = 0; i < obj.length; i++) {
            console.log(obj[i].courseSysName);
            let pObj = obj[i];
            html += `
                <div>
                    <div class="zhutu">
                        <img src="${pObj.courseSysImgUrl}" alt="">
                    </div>
                    <div class="ziti">
                        <div class="ppp">${pObj.courseSysName}</div>
                        <div class="zizi">
                            <span>导师：${pObj.teacher.username}</span>
                            <span class="teshu">${pObj.courseSysWatchNumber}人已购</span>
                        </div>
                    </div>
                </div>
            `
        }
        box.innerHTML = html;
    })
}

li02.onclick = function() {
    zonghe.style.display = 'none';
    remen.style.display = 'block';
    xinzeng.style.display = 'none';
    axios.post(hottestCourseSysApi, {
        token,
        "pageNum": 1,
        "pageSize": 10
    }).then(res => {
        console.log(res.data.info);
        let obj = res.data.info;
        let html = '';
        for (let i = 0; i < obj.length; i++) {
            console.log(obj[i].courseSysName);
            let pObj = obj[i];
            html += `
                <div>
                    <div class="zhutu">
                        <img src="${pObj.courseSysImgUrl}" alt="">
                    </div>
                    <div class="ziti">
                        <div class="ppp">${pObj.courseSysName}</div>
                        <div class="zizi">
                            <span>导师：${pObj.teacher.username}</span>
                            <span class="teshu">${pObj.courseSysWatchNumber}人已购</span>
                        </div>
                    </div>
                </div>
            `
        }
        box.innerHTML = html;
    })
}

li03.onclick = function() {
    zonghe.style.display = 'none';
    remen.style.display = 'none';
    xinzeng.style.display = 'block';
    axios.post(latestCourseSysApi, {
        token,
        "pageNum": 1,
        "pageSize": 10
    }).then(res => {
        console.log(res.data.info);
        let obj = res.data.info;
        let html = '';
        for (let i = 0; i < obj.length; i++) {
            console.log(obj[i].courseSysName);
            let pObj = obj[i];
            html += `
                <div>
                    <div class="zhutu">
                        <img src="${pObj.courseSysImgUrl}" alt="">
                    </div>
                    <div class="ziti">
                        <div class="ppp">方便识别</div>
                        <div class="zizi">
                            <span>导师：${pObj.teacher.username}</span>
                            <span class="teshu">${pObj.courseSysWatchNumber}人已购</span>
                        </div>
                    </div>
                </div>
            `
        }
        box.innerHTML = html;
    })
}